@import url(../../assets/css/normalize.css);
@import url(../../assets/css/common.css);
@import url(../api/api.css);
.head {
  background-color: #f1f1f1;
  height: 66px;
}
.move-box {
  width: 100%;
  height: 420px;
  position: relative;
  background-color: #f1f1f1;
  justify-content: space-around;
}
.move-box .move-text {
  justify-content: flex-start;
  height: 270px;
  position: absolute;
  top: 106px;
}
.move-box .move-text .move-left {
  width: 260px;
  height: 270px;
  background-color: #fff;
  text-align: center;
  box-sizing: border-box;
  margin-right: 80px;
}
.move-box .move-text .move-left .one-p {
  padding: 40px 0px;
}
.move-box .move-text .move-left .two-p img {
  margin: 0px 28px;
}
.move-box .move-text .move-left .the-p {
  color: #c6c6c6;
  padding-top: 16px;
  justify-content: space-evenly;
}
.move-box .move-text .move-right {
  height: 26px;
}
.move-box .move-text .move-right h2 {
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 10px;
  color: #555;
}
.move-box .move-text .move-right .right-s {
  font-size: 12px;
  margin-right: 10px;
  display: inline-block;
  padding: 2px 8px;
  color: #00bdff;
  border: 1px solid #00bdff;
}
.move-box .move-text .move-right .limi {
  color: #f8aa39;
  margin-right: 30px;
  font-weight: bold;
}
.move-box .move-text .move-right .limi img {
  margin-right: 10px;
}
.move-box .move-text .move-right .dete {
  color: #666;
  margin-top: 10px;
}
.move-box .move-text .move-right .select {
  height: 44px;
  position: relative;
  cursor: pointer;
}
.move-box .move-text .move-right .select .li:hover .sus {
  height: 140px;
}
.move-box .move-text .move-right .select .sus {
  overflow: hidden;
  height: 0px;
  text-align: center;
  position: absolute;
  top: 30px;
  left: -10px;
  transition: all 1s;
}
.move-box .move-text .move-right .select .sus img {
  height: 120px;
}
.move-box .move-text .move-right .select li {
  position: relative;
  margin-top: 16px;
  color: #00bdff;
  margin-right: 20px;
  padding: 4px 10px;
  border: 1px solid #00bdff;
}
.move-box .move-text .move-right .select li .select-img {
  position: absolute;
  right: 0px;
  bottom: 0px;
  display: none;
}
.move-box .move-text .move-right .select li .show {
  display: block;
}
.move-box .move-text .move-right .xrp {
  margin-top: 20px;
  font-size: 12px;
}
.move-box .move-text .move-right .xrp .s-price {
  color: red;
}
.move-box .move-text .move-right .btn {
  font-size: 18px;
  font-weight: bold;
  margin-top: 20px;
  color: #f1f1f1;
  border-radius: 6px;
  background-color: #00bdff;
  width: 120px;
  height: 40px;
}
.main {
  height: 40px;
  line-height: 40px;
  border-bottom: 1px solid #ccc;
  margin-bottom: 40px;
  cursor: pointer;
}
.main li {
  margin-right: 120px;
  color: #666;
}
.main .live {
  color: #00bdff;
  border-bottom: #00bdff 2px solid;
}
.tab-op {
  width: 800px;
  height: 1400px;
  /* .in-force {
    width: 800px;
    height: 1400px;
    
  } */
}
.tab-op .listyle {
  height: 0px;
  overflow: hidden;
}
.tab-op .listyle p {
  color: #555;
  margin-bottom: 20px;
}
.tab-op .listyle .test-btn {
  background-color: #00bdff;
  color: #f1f1f1;
  width: 150px;
  height: 34px;
  margin-bottom: 20px;
}
.tab-op .listyle .re-title {
  display: block;
  padding: 2px 10px;
  border-left: #00bdff 4px solid;
  margin-bottom: 20px;
  margin-top: 40px;
}
.tab-op .listyle table {
  border: #e7e7e7 1px solid;
  width: 100%;
  color: #999;
  font-size: 12px;
  line-height: 40px;
  border-collapse: collapse;
}
.tab-op .listyle table .re-otab {
  /*  height: 40px; */
  background-color: #fbfbfb;
  /* color: #999; */
  width: 100%;
  /*  font-size: 14px; */
}
.tab-op .listyle table .re-otab .four {
  padding-left: 20px;
}
.tab-op .listyle table .re-otab .tr-first {
  padding-left: 20px;
  width: 15%;
}
.tab-op .listyle table .re-otab .tr-mid {
  width: 10%;
}
.tab-op .listyle table .re-otab .tr-olast {
  width: 55%;
}
.tab-op .listyle table .re-ttab {
  /* color: #999; */
  /* font-size: 14px; */
  color: #666;
}
.tab-op .listyle table .re-ttab th {
  font-weight: normal;
}
.tab-op .listyle table .re-ttab .four {
  padding-left: 20px;
}
.tab-op .listyle table .re-ttab .tr-two {
  padding-left: 20px;
}
.tab-op .listyle .sp-box {
  display: inline-block;
  height: 30px;
  line-height: 30px;
  margin-top: 36px;
  color: #f1f1f1;
  background-color: #1271ef;
  border-radius: 6px;
  padding: 2px 8px;
}
.tab-op .listyle .example {
  box-sizing: border-box;
  width: 800px;
  height: 400px;
  background-color: #fafafa;
  padding: 20px;
}
.tab-op .in-force {
  width: 800px;
  height: 1400px;
}
.banner {
  margin-left: 60px;
  height: 800px;
  width: 340px;
}
.banner .ban-img img {
  margin-bottom: 10px;
}
.banner .activ {
  font-size: 16px;
  line-height: 26px;
  color: #999;
  margin-top: 40px;
}
.banner .activ-o {
  margin-top: 10px;
  font-size: 16px;
  line-height: 26px;
  color: #999;
}
.banner .img-box {
  padding: 10px;
  text-align: center;
  width: 50px;
  height: 40px;
  border: 1px solid #ccc;
  float: left;
  margin-right: 10px;
}
.banner .img-box img {
  padding-top: 10px;
}
.banner .fr {
  float: left;
}
.banner .fr .ban-p {
  color: #555;
  font-size: 16px;
  margin-bottom: 10px;
}
.banner .fr .ban-pp {
  font-size: 12px;
  color: #999;
}
.like {
  width: 226px;
  height: 78px;
  border-bottom: 1px solid #ccc;
  margin-bottom: 20px;
}
.tong {
  height: 150px;
  background-color: #00bdff;
  text-align: center;
  font-size: 28px;
  color: #fff;
}
.tong h3 {
  padding-top: 20px;
  padding-bottom: 20px;
}
.tong a {
  color: #fff;
  font-size: 16px;
  display: inline-block;
  width: 150px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #fff;
}
